<template>
  <!-- 查找产品 -->
  <el-dialog
    class="search-customer"
    title="查找产品"
    :visible.sync="dialogshow"
    :before-close="dialogClose"
    top="10vh"
    width="90%"
    :fullscreen="fullscreen"
    style="display: none"
  >
    <dialog-tools
      v-bind:back="true"
      v-bind:next="true"
      v-bind:goback="true"
      v-bind:prev="true"
      v-bind:screen="true"
      @clickfullscreen="clickfullscreen"
    >
    </dialog-tools>
    <div>
      <el-row>
        <el-input
          placeholder
          v-model="inputSearch1"
          class="input-with-select-1 input-search-1"
          style="width: 450px; top: 9px"
          speech
          x-webkit-speech
          size="large"
        >
          <el-select
            v-model="selectsearch1"
            slot="prepend"
            placeholder="请选择"
            style="width: 120px"
          >
            <el-option label="物品名称" value="1"></el-option>
            <el-option label="物品名称" value="2"></el-option>
            <el-option label="款号" value="3"></el-option>
            <el-option label="id" value="4"></el-option>
            <!-- <el-option label="序号id" value="5"></el-option> -->
          </el-select>
          <!-- <i slot="prefix" class="iconfont iconpaizhao1"></i> -->
          <el-button slot="append" icon="el-icon-search" style="height: 47px"
            >查询</el-button
          >
        </el-input>
      </el-row>
      <el-table
        ref="multipleTable"
        stripe
        :data="tableData"
        :show-summary="false"
        border
        height="500"
        row-class-name="tableRow"
        header-row-class-name="tableHeader"
        :highlight-current-row="true"
        @row-dblclick="dialogClose"
        style="width: 100%; border-top: 1px solid #c5c5c5"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column prop="id" label="序号" sortable width="80">
        </el-table-column>
        <el-table-column prop="image" label="图片" width="120">
          <template scope="scope">
            <img
              :src="scope.row.image"
              width="40"
              height="40"
              class="head_pic"
            />
          </template>
        </el-table-column>
        <el-table-column prop="wpmc" label="物品名称" sortable width="120">
        </el-table-column>
        <el-table-column prop="wppl" label="物品品类" sortable width="120">
        </el-table-column>
        <el-table-column prop="kh" label="款号" sortable width="120">
        </el-table-column>
        <el-table-column prop="wpdj" label="物品等级" sortable width="120">
        </el-table-column>
        <el-table-column prop="dw" label="单位" sortable width="80">
        </el-table-column>
        <el-table-column prop="gg" label="规格" sortable width="120">
        </el-table-column>
        <el-table-column prop="cc" label="尺寸" sortable width="120">
        </el-table-column>
        <el-table-column prop="gjspl" label="贵金属品类" sortable width="120">
        </el-table-column>
        <el-table-column prop="gjsys" label="贵金属颜色" sortable width="120">
        </el-table-column>
        <el-table-column prop="zsmc" label="主石名称" sortable width="120">
        </el-table-column>
        <el-table-column prop="zsys" label="主石颜色" sortable width="120">
        </el-table-column>
        <el-table-column prop="fsmc" label="副石名称" width="120">
        </el-table-column>
        <el-table-column prop="fsys" label="副石颜色" width="120">
        </el-table-column>
        <!-- <el-table-column prop="jbgh" label="基本工费" width="120">
      </el-table-column>
      <el-table-column prop="xsh" label="镶石费" width="120">
      </el-table-column>
      <el-table-column prop="pjh" label="配件费" width="120">
      </el-table-column>
      <el-table-column prop="zsh" label="证书费" width="120">
      </el-table-column>
      <el-table-column prop="bzhh" label="包装盒费" width="120">
      </el-table-column>
            <el-table-column prop="bzhh" label="包装盒费" width="120">
      </el-table-column>
                  <el-table-column prop="sl" label="税率" width="120"> 
      </el-table-column>-->
        <el-table-column prop="hsj" label="含税价" width="120">
        </el-table-column>
        <el-table-column prop="bhwj" label="不含税价" width="120">
        </el-table-column>
        <el-table-column prop="cjr" label="创建人" width="120">
        </el-table-column>
        <el-table-column prop="create_time" label="创建时间" width="120">
        </el-table-column>
        <el-table-column prop="update_time" label="更新时间" width="120">
        </el-table-column>
      </el-table>
      <div class="block">
        <el-pagination layout="prev, pager, next" :total="50"> </el-pagination>
      </div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogClose">取 消</el-button>
      <el-button type="primary" @click="alertopen">确定</el-button>
    </div>
  </el-dialog>
</template>

<style scoped>
.search-customer .el-dialog__body {
  padding-top: 10px;
}

.input-with-select.input-search1 .el-input__prefix {
  font-size: 35px;
  left: 190px;
  cursor: pointer;
}

.input-with-select.input-search1 .el-input__prefix .iconfont {
  font-size: 35px;
  font-weight: 200;
}

.input-with-select.input-search1 .el-input__prefix .iconfont:hover {
  color: cornflowerblue;
}

.input-with-select.input-search1 .el-input__inner {
  height: 47px;
  /* padding-left:15px;*/
}

.input-with-select.input-search1 .el-input-group__prepend {
  width: 100px;
  padding-left: 5px;
}

iconfont iconpaizhao1 .col-md-12 {
  display: block;
  overflow: hidden;
  background-color: #f5f5f5;
}
</style>

<script>
module.exports = {
  methods: {
    dialogAdd() {
      console.log(123);
      console.log(this.dialogCustomerGenji);
    },
    dialogClose() {
      this.$emit("dialog_close", 1);
    },
    clickfullscreen() {
      this.fullscreen = !this.fullscreen;
    },
    submitForm() {
      this.$refs["elForm"].validate((valid) => {
        if (!valid) return;
        // TODO 提交表单
      });
    },
    resetForm() {
      this.$refs["elForm"].resetFields();
    },
    alertopen() {
      this.$confirm("是否继续操作?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$message({
            type: "success",
            message: "操作成功!",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
  },
  props: ["dialogshow"],
  data() {
    return {
      inputSearch1: "",
      selectsearch1: "",
      formData: {
        field108: "黄先生(业务联系人1)",
        field114: undefined,
        field110: undefined,
        field111: undefined,
        field113: null,
        field115: null,
        field116: null,
      },
      rules: {
        field108: [
          {
            required: true,
            message: "请选择业务联系人",
            trigger: "blur",
          },
        ],
        field114: [
          {
            required: true,
            message: "请选择分类",
            trigger: "change",
          },
        ],
        field110: [
          {
            required: true,
            message: "请至少选择一个跟进类型",
            trigger: "change",
          },
        ],
        field111: [
          {
            required: true,
            message: "请输入跟进情况",
            trigger: "blur",
          },
        ],
        // field113: [{
        //   required: true,
        //   message: '请选择下次跟进',
        //   trigger: 'change'
        // }],
      },

      dialogChangeGenji: false,
      fullscreen: false,
      Sendmssages: {
        address: "",
        customercate: "",
        cate: "",
        nickname: "",
        creditrank: "",
        name: "",
      },
      tableData: [
        {
          id: "1",
          create_time: "2016-05-02 08:08:08",
          update_time: "2016-05-02 08:08:08",
          image: "/public/images/eh1.jpg",
          kfmc: "某珠宝公司",
          kflxr: "王先生",
          wpmc: "戒指",
          spzt: "审批中",
          wppl: "戒指",
          kh: "WERWQE123",
          wpdj: "A类",
          dw: "件",
          gjsp: "铂金999.99%",
          fsys: "红",
        },
        {
          id: "2",
          create_time: "2016-05-02 08:08:08",
          update_time: "2016-05-02 08:08:08",
          image: "/public/images/eh1.jpg",
          kfmc: "某珠宝公司",
          kflxr: "王先生",
          wpmc: "戒指",
          spzt: "审批中",
          wppl: "戒指",
          kh: "WERWQE123",
          wpdj: "A类",
          dw: "件",
          gjsp: "铂金999.99%",
          fsys: "红",
        },
        {
          id: "3",
          create_time: "2016-05-02 08:08:08",
          update_time: "2016-05-02 08:08:08",
          image: "/public/images/eh1.jpg",
          kfmc: "某珠宝公司",
          kflxr: "王先生",
          wpmc: "戒指",
          spzt: "审批中",
          wppl: "戒指",
          kh: "WERWQE123",
          wpdj: "A类",
          dw: "件",
          gjsp: "铂金999.99%",
          fsys: "红",
        },
        {
          id: "4",
        },
        {
          id: "5",
        },
      ],
    };
  },
  components: {
    "dialog-tools": "url:../tools/dialog-tools.vue",
  },
};
</script>
